<include file="public:header"/>
<include file="public:sidebar"/>
<div class="content-wrapper">
    <section class="content">
        <style>
            .profile{
               position: relative;
            }
            .vip{
                position: absolute;
                left: 54%;
                top: 80px;
                color: #96ca0a;
                font-size: 30px;
            }
            .vip-top{
                position: absolute;
                right: 10px;
                top: 10px;
            }
            .tables{
                background-color:#fff;
                border-top: 3px solid #3c8dbc;
            }
        </style>
        <div class="row">
            <div class="col-md-5">
                <div class="box box-primary">
                    <div class="box-body box-profile profile">
                        <img class="profile-user-img img-responsive img-circle"
                             src="__IMAGES__/avatar.gif" alt="User profile picture">
                        <notempty name="user.is_vip">
                            <eq name="user.is_vip" value="1"><i class="fa fa-vimeo vip"></i></eq>
                            <else/>
                            <a href="javascript:;" class="vip-top" data-click="1">升级vip</a>
                        </notempty>
                        <h3 class="profile-username text-center">{$user.username}</h3>
                        <p class="text-muted text-center">加入时间:{$user.create_time}</p>
                        <ul class="list-group list-group-unbordered" style="margin-top: 10px">
                            <li class="list-group-item">
                                <b>账户余额</b> <a class="pull-right">{$user.money}</a>
                            </li>
                            <li class="list-group-item">
                                <b>红包余额</b> <a class="pull-right">{$user.hb_money}</a>
                            </li>
                            <li class="list-group-item">
                                <b>资金冻结</b> <a class="pull-right">{$user.dong_money}</a>
                            </li>
                            <li class="list-group-item">
                                <b>最后登录IP</b> <a class="pull-right">{$user.last_ip}</a>
                            </li>
                            <li class="list-group-item">
                                <b>最后登录时间</b> <a class="pull-right">{$user.last_date|date='Y-m-d H:i:s'}</a>
                            </li>
                            <li class="list-group-item">
                                <b>最后登录地址</b> <a class="pull-right">{$user.last_address}</a>
                            </li>
                            <li class="list-group-item">
                                <b>登录密码</b> <a href="javascript:;" class="pull-right update-pwd">修改</a>
                            </li>
                        </ul>
                        <!--<a href="#" class="btn btn-primary btn-block"><b>Follow</b></a>-->
                    </div>
                </div>
            </div>
            <div class="col-md-7 tables">
                <h4 class="page-header">
                    <i class="fa fa-cny"></i>
                    最近充值记录
                    <small class="pull-right">
                        <a href="{:Url('rechange/index')}">更多&gt;</a>
                    </small>
                </h4>
                <table class="table table-responsive table-striped">
                    <thead>
                        <tr>
                            <th>单号</th>
                            <th>主题</th>
                            <th>金额</th>
                            <th>支付日期</th>
                        </tr>
                    </thead>
                    <tbody>
                        <notempty name="list">
                            <volist name="list" id="vo">
                                <tr>
                                    <td>{$vo.out_trade_no}</td>
                                    <td>{$vo.title}</td>
                                    <td>¥{$vo.total_fee}</td>
                                    <td>{$vo.finish_time}</td>
                                </tr>
                            </volist>
                            <else/>
                            <tr>
                                <td colspan="4">
                                    没有数据
                                </td>
                            </tr>
                        </notempty>
                    </tbody>
                </table>
            </div>
        </div>
    </section>
</div>
<div id="qrcode" style="display: none;padding:20px;"></div>
<script src="https://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
<script>
    layui.use(['form','layer'],function () {
        var form = layui.form,
            layer = layui.layer;
        $(document).on('click','.vip-top',function (e) {
            e.preventDefault();
            var click = $(this).attr('data-click');
            if(Number(click)!==1){
                return false;
            }
            $(this).attr('data-click',2);
            layer.load();
            $.post('{:Url("pay/create_order")}',{
                title: '升级VIP',
                type: 1
            },function (result) {
                layer.closeAll();
                if(result.status){
                    $("#qrcode").empty().qrcode(result.data);
                    layer.open({
                        type: 1,
                        title: '升级VIP',
                        content: $('#qrcode'),
                        shade: false,
                        end:function () {
                            $.post('{:Url("pay/query_order")}',{
                                out_trade_no: result.out_trade_no
                            },function (result) {
                                location.reload();
                            });
                        }
                    });
                    var index = setInterval(function () {
                        $.post('{:Url("pay/query_order")}',{
                            out_trade_no: result.out_trade_no
                        },function (result) {
                            if(result.code===0){
                                layer.msg(result.msg);
                                clearInterval(index);
                            }
                        });
                    },1000)
                }
            })
        });
        $(document).on('click','.update-pwd',function (e) {
            e.preventDefault();
            layer.prompt({
                formType: 1,
                title: '请输入密码'
            }, function(value, index, elem){
                var index1 = layer.load(2,{shade: [0.8, '#000']});
                $.post('{:Url("mch/change_pwd")}',{pwd: value},function (result) {
                    layer.close(index1);
                    if(result.status){
                        layer.alert(result.msg,{icon:5});
                    }
                    layer.alert(result.msg,{icon:6,end:function () {
                        location.href = '{:Url("user/login")}';
                    }});
                });
                layer.close(index);
            });
        });
    });
</script>
<include file="public:footer"/>